hello，JS：06-5 Math/Math

发表于 | 更新于: | 分类于 ， | 阅读次数:
字数统计: 2,551 | 阅读时长 ≈ 12

一、字符串

1、单双引号（实际无区别）

特别场景下，单引号更严格。如："It's a long journey"

2、转义字符

就是在内部不能转化的单、双引号前面加上反斜杠，用来转义，成为一个完整的字符串

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
var str = 'he\'llo'
--> undefined
str
--> "he'llo"

//展示长度
str.length
--> 6

//展示斜杠
var str = "\\ccc"
--> undefined
str
--> "\ccc"

//展示换行
//例子1：
var longString = "Long \  //注：注意不要多出空格，会报错
long \
long \
string";
--> undefined
longString
--> "Long long long string"

----------------------------------
var longString = 'Long '
  + 'long '
  + 'long '
  + 'string';
--> undefined
longString
--> "Long long long string"

//例子2：
var a = 'hel \
\
lo'
--> undefined
a
"hel lo"

---------------------------------

var a = 'hel\
\
lo'
--> undefined
a
--> "hello"

//例子3：ES6用法
`
hello
world
`
--> "
    hello
    world
    "

3、字符串常见用法

（1）长度计算、连接

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
//计算
var str = "hello"
--> undefined
str.length
--> 5
str[0]
--> "h"
str[str.length - 1]
--> "o"
str.charAt(0)  //截取字符串的首字母
--> "h"
str.charCodeAt(0) //获取Ascii 码
--> 104

//连接
var str2 = "world" 
--> undefined
var str1 = "hello " //在测试时，发现字符串里空格，字符串内部相应地会出现间隙
--> undefined
var str3 = str1 + str2
--> undefined
str3
--> "hello world"

（2）字符串截取

1
2
3
4
5
6
var str = "hello world"
--> undefined
str.substr(1, 3) 
--> "ell"   //第一个是开始位置， 第二个是长度  ell
str.substring(1, 3)
--> "el"    //第一个是开始位置，第二个是结束位置，长度为第二个－第一个  el

（3）字符串查找

1
2
3
4
5
6
7
8
9
10
11
12
var str = "hello my world";
--> undefined
str.search('my')
--> 6
str.replace('my', 'your')
--> "hello your world"
str.match('my')
--> ["my", index: 6, input: "hello my world", groups: undefined]

//查找位数:ES6中的用法
str.indexOf('el')
--> 1

（4）字符串的大小写

1
2
3
4
5
6
var str = "Hello";
--> undefined
str.toUpperCase()
--> "HELLO"
 str.toLowerCase()
--> "hello"

（5）字符串的拼接

1
2
3
4
5
6
var color = 'red'
--> undefined
str = '衣服的颜色是' + color
--> "衣服的颜色是red"
str2 = `今天的颜色很${color}`
--> "今天的颜色很red"

二、Math（JS内置对象）

1、概念

看了一下概念，看懂了不懂怎么说，就是用Math提供一种数学计算方法：
如图：

2、Math的常用属性

1
2
3
4
5
6
7
8
9
10
11
Math.E      // 2.718281828459045
Math.LN2    // 0.6931471805599453
Math.LN10   // 2.302585092994046
Math.LOG2E  // 1.4426950408889634
Math.LOG10E  // 0.4342944819032518
Math.PI     // 3.141592653589793
Math.SQRT1_2 // 0.7071067811865476
Math.SQRT2 // 1.4142135623730951
如：
Math.PI*3*3
--> 28.274333882308138

3.日常使用Math

建议理解透每个属性用法，自己做题默念用法规则，在控制台验证自己的结果

（1）round 用于四舍五入
语法：
Math.round()

对于负值的运算结果与正值不太一样，主要集中于.5的处理上
如：

1
2
3
4
Math.round(-4.6) //-5
Math.round(-4.5) //-4
Math.round(-1.5) //-1
Math.round(-0.5) //-0

而正值

1
2
3
4
Math.round(0.5) //1
Math.round(1.5) //2
Math.round(4.5) //5
Math.round(4.8) //5

（2）abs 返回参数值的绝对值

1
Math.abs()

（3）max/min 返回最大参数/最小参数

1
2
Math.max()
Math.min()

一些例子：

1
2
3
Math.max(4, -1, 's')  //NaN
Math.max.apply(null,[-2,-9,2,6]) //6
Math.min.apply(null,[-2,-9,2,6]) // -9

（4）floor/ceil
A、floor 返回小于参数值的最大整数 不等于 取整
如：

1
2
3
4
5
6
Math.floor(3.8)  //3
Math.floor(3.5)  //3
Math.floor(3.2)  // 3
Math.floor(-3.2) // -4  
Math.floor(-3.5) //-4
Math.floor(-3.8) //-4

B、ceil 返回大于参数值的最小整数

1
2
3
4
5
6
Math.ceil(3.8)  //4
Math.ceil(3.5)  //4
Math.ceil(3.2)  // 4
Math.ceil(-3.2) //-3 
Math.ceil(-3.5) //-3
Math.ceil(-3.8) //-3

（3）pow/sqrt

  • pow 用于求平方,如：

    1
    2
    Math.pow(2, 2) // 4
    Math.pow(2, 3) // 8

  • sqrt 用于求参数的平方根（即参数包含在这种√￣中的值），如：

    1
    2
    Math.sqrt(4) // 2   相当于√4￣=2
    Math.sqrt(-4) // NaN

（4）log/exp

  • log 用于返回以e为底的自然对数值

普及一下对数函数：
如果ax=N（a>0，且a≠1），那么数x叫做以a为底N的对数，记作x=logaN，读作以a为底N的对数，其中a叫做对数的底数，N叫做真数。
Math.log(Math.E)// 1

  • exp 用于返回常数e的参数次方
    1
    2
    Math.exp(1) // 2.718281828459045  //10÷e
    Math.exp(3) // 20.085536923187668

【重点】（5）random 用于求随机数，返回0到1之间的一个伪随机数，可能等于0，但是一定小于1。如你输入Math.random()，任何时候都会生成按照以上规则组成的随机数

实践0：返回给定范围内的随机数

1
2
3
function getRandomArbitrary(min, max) {
  return Math.random() * (max - min) + min;
}

实践1： 均为随机

  • 获取一个0-100的整数
  • 获取一个0-5之间的整数
  • 获取一个1-6之间的整数
  • 获取一个10-20之间的整数

实践2: 获取一个随机的字符串

1
2
3
4
5
6
7
8
9
10
11
12
13
function randomStr(len){
    var str = '' //第3步
    var dict = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ_'   //第4步
    for(var i= 0; i<len; i++){ //用来执行次数
       var index = Math.floor(Math.random()*dict.length)//通过Math.floor来取整  //用来获取随机长度的整数值
       str += dict[index]  
    } //第5步
   return str//第6步
  
}//第1步：定义一个随机字符串长度，空

var str = randomStr(32)
console.log(str) //第2步：定义str具体值（注：这个随机字符串包括大小写字母数字等等）

图：

可以在控制台算一下所声明的 dict随机字符串有多少位

1
2
3
4
5
6
var dict = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ_'
--> undefined
dict.length
--> 63

//基本需要的是下标为0-62的随机参数

实践3： 获取一个随机IP

写一个函数，生成一个随机IP地址，一个合法的IP地址0.0.0.0~255.255.255.255

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
function getRandIP(){
  var ip = []
  for(var i = 0;i<4;i++){   //i<4是由于下标位数
     ip = ip+Math.floor(Math.random()*256)+"."
     }
return ip 
  }
var ip = getRandIP()
console.log(ip) // 输出ip地址
或
function getRandIP()
{
    var temp = 0;
    ip = '';
    for (var i = 0; i < 4; i++)
    {
        temp = parseInt(Math.random() * 256);
        if (i < 3) 
        {
            ip = ip + temp + '.';           
        }
        else
        {
            ip = ip + temp
        }
    }
    return ip;
}
var ip = getRandIP()
console.log(ip)  //输出ip地址

实践4： 获取一个随机颜色字符串

写一个函数，生成一个随机颜色字符串，合法的颜色为#000000~#ffffff

1
2
3
4
5
6
7
8
9
10
11
function getRandColor(){
    var str ='#'
    var dict ='0123456789abcdef'
    for(var i= 1;i<6 ;i++){
         var index = Math.floor(Math.random()*dict.length)
         str += dict[index] //str = str+dict[index]
}
 return str
}
var color = getRandColor()
console.log(color)

三、Date（JS的内置对象）

1、定义：

是JavaScript提供日期和时间的操作接口

2、Date的几个静态方法：

（1）Date.now() ——获取时间毫秒数
如：

1
2
Date.now()
--> 1528904474005  //根据实际时间得出的毫秒数也不一样

now方法返回的毫秒数，具体指的是距离1970年1月1日00：00：00的毫秒数
或

Date.parse()
注：如果解析失败，返回NaN
如：

1
2
Date.parse(2011-11-11)
--> 599616000000

（2）new Date()
A、通过new date方法，获取一个时间对象

1
2
new Date(2020,8,14)  
--> Mon Sep 14 2020 00:00:00 GMT+0800 (CST)

通过字符串所生成的时间对象（且没有传递时分秒），获取的则是日期，而对于处于东八区的我们则是8点

1
2
3
4
str ='2017-08-01'
--> "2017-08-01"
new Date(str)
--> Tue Aug 01 2017 08:00:00 GMT+0800 (CST)

若

1
2
3
4
str ='2017-08-01 00:00:00'
--> "2017-08-01 00:00:00"
new Date(str)
--> Tue Aug 01 2017 00:00:00 GMT+0800 (CST)

B、声明一个变量d，d则是一个日期对象，返回的则是一个字符串，如：

1
2
3
4
5
6
var d = new Date()
--> undefined
d
--> Thu Jun 14 2018 00:08:31 GMT+0800 (CST) //字符串，实际时间有所不同
typeof d
--> "object"  //验证为一个对象

通过变量d，一个对象，获取一些必要信息，如：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
d.getDate()
--> 14
d.getFullYear()
--> 2018
d.getMonth()
--> 5
d.getDay()
--> 4
d.getHours()
--> 0
d.getMinutes()
--> 8
d.getSeconds()
--> 31
d.getMilliseconds()
--> 438

3、实践：

（1）实践1：100天前是几月几号？

注：当前时间为：2018.6.19 周二

时间大概：15：24：35（时间误差不到3-5mins）

1
2
3
4
5
6
7
8
var curTime = Date.now()  //计算当前时间的时间毫秒数
--> undefined
new Date(curTime-100*24*60*60*1000)
--> Sun Mar 11 2018 15:23:02 GMT+0800 (中国标准时间) //获取100天以前的具体日期
new Date(curTime-100*24*60*60*1000).getMonth()
--> 2
new Date(curTime-100*24*60*60*1000).getDate()
--> 11

（2）实践2：复杂函数的执行时间如何计算？

1
2
3
4
5
6
var start = Date.now()
--> undefined
var end =Date.now()
--> undefined
end - start
--> 5196

【重点】（3）实践3：

写一个函数，参数为时间对象毫秒数的字符串格式，返回值为字符串（即输出打印出时间戳）。假设参数为时间对象毫秒数t，根据t的时间分别返回如下字符串：

  • 刚刚（ t 距当前时间不到1分钟时间间隔）
  • 3分钟前 (t距当前时间大于等于1分钟，小于1小时)
  • 8小时前 (t 距离当前时间大于等于1小时，小于24小时)
  • 3天前 (t 距离当前时间大于等于24小时，小于30天)
  • 2个月前 (t 距离当前时间大于等于30天小于12个月)
  • 8年前 (t 距离当前时间大于等于12个月)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
function friendlyDate (time) {
    var t = new Date().getTime();
    var d = (t-time)/1000;
    switch(true){
        case d < 60:
        console.log('刚刚');
        break;
        case d >=60 && d<60*60:
        console.log(Math.floor(d/60)+'分钟前');
        break;
        case d >=3600 && d<3600*24:
        console.log(Math.floor(d/3600)+"小时前");
        break;
        case d >=3600*24 && d<3600*24*30:
        console.log(Math.floor(d/3600/24)+"天前");
        break;
        case d >=3600*24*30 && d<3600*24*30*12:
        console.log(Math.floor(d/3600/24/30)+"月前");
        break;
        default:
        console.log(Math.floor(d/3600/24/30/12)+"年前");
        break;
    }
}
var str = friendlyDate(Date.now()-1000*60);
console.log(str);
var str2 = friendlyDate('1483941245793');
console.log(str2);
-------------本文结束感谢您的阅读-------------